// ec-canvas/echarts.js
// 这是一个简化版本的ECharts，包含基本图表类型，用于微信小程序
export default {
  init: function(canvas, width, height, dpr) {
    // 创建ECharts实例
    const chart = {
      canvas: canvas,
      width: width,
      height: height,
      dpr: dpr || 1,
      option: null,
      handler: {
        dispatch: function() {},
        processGesture: function() {}
      },
      getZr: function() {
        return {
          handler: this.handler
        };
      },
      setOption: function(option) {
        this.option = option;
        this._render();
      },
      getDevicePixelRatio: function() {
        return this.dpr;
      },
      clear: function() {
        const ctx = this.canvas.getContext('2d');
        ctx.clearRect(0, 0, this.width, this.height);
      },
      _render: function() {
        // 简化的渲染函数
        // 实际应用中需要根据option配置绘制不同类型的图表
        const ctx = this.canvas.getContext('2d');
        ctx.clearRect(0, 0, this.width, this.height);

        if (!this.option) return;

        // 绘制标题
        if (this.option.title && this.option.title.text) {
          ctx.font = '16px sans-serif';
          ctx.fillStyle = '#333';
          ctx.textAlign = 'center';
          ctx.fillText(this.option.title.text, this.width / 2, 30);
        }

        // 简单的柱状图实现
        if (this.option.series && this.option.series.length > 0) {
          const series = this.option.series[0];
          if (series.type === 'bar' && series.data) {
            const data = series.data;
            const barWidth = this.width / (data.length * 2);
            const barSpacing = barWidth;
            const maxValue = Math.max(...data);
            const heightRatio = (this.height - 60) / maxValue;

            ctx.fillStyle = '#4CAF50'; // 使用应用主色调
            for (let i = 0; i < data.length; i++) {
              const x = i * (barWidth + barSpacing) + barSpacing;
              const barHeight = data[i] * heightRatio;
              const y = this.height - barHeight - 30;
              ctx.fillRect(x, y, barWidth, barHeight);

              // 数值标签
              ctx.fillStyle = '#666';
              ctx.font = '12px sans-serif';
              ctx.textAlign = 'center';
              ctx.fillText(data[i].toString(), x + barWidth / 2, y - 5);
            }
          } else if (series.type === 'line' && series.data) {
            // 简单的折线图实现
            const data = series.data;
            const pointSpacing = this.width / (data.length + 1);
            const maxValue = Math.max(...data);
            const heightRatio = (this.height - 60) / maxValue;

            ctx.strokeStyle = '#2196F3'; // 使用应用辅色调
            ctx.lineWidth = 2;
            ctx.beginPath();

            for (let i = 0; i < data.length; i++) {
              const x = (i + 1) * pointSpacing;
              const y = this.height - data[i] * heightRatio - 30;
              
              if (i === 0) {
                ctx.moveTo(x, y);
              } else {
                ctx.lineTo(x, y);
              }

              // 绘制点
              ctx.fillStyle = '#2196F3';
              ctx.beginPath();
              ctx.arc(x, y, 4, 0, Math.PI * 2);
              ctx.fill();

              // 数值标签
              ctx.fillStyle = '#666';
              ctx.font = '12px sans-serif';
              ctx.textAlign = 'center';
              ctx.fillText(data[i].toString(), x, y - 15);
            }
            ctx.stroke();
          } else if (series.type === 'pie' && series.data) {
            // 简单的饼图实现
            const data = series.data;
            const centerX = this.width / 2;
            const centerY = this.height / 2;
            const radius = Math.min(centerX, centerY) - 30;
            
            let total = 0;
            data.forEach(item => {
              total += item.value;
            });

            let startAngle = 0;
            const colors = ['#4CAF50', '#2196F3', '#FFC107', '#9C27B0', '#F44336'];

            for (let i = 0; i < data.length; i++) {
              const item = data[i];
              const angle = (item.value / total) * Math.PI * 2;
              
              ctx.fillStyle = colors[i % colors.length];
              ctx.beginPath();
              ctx.moveTo(centerX, centerY);
              ctx.arc(centerX, centerY, radius, startAngle, startAngle + angle);
              ctx.closePath();
              ctx.fill();

              // 绘制标签
              const labelAngle = startAngle + angle / 2;
              const labelX = centerX + (radius + 20) * Math.cos(labelAngle);
              const labelY = centerY + (radius + 20) * Math.sin(labelAngle);
              
              ctx.fillStyle = '#333';
              ctx.font = '12px sans-serif';
              ctx.textAlign = 'center';
              ctx.fillText(item.name, labelX, labelY);

              startAngle += angle;
            }
          }
        }

        // 使canvas绘制生效
        if (ctx.draw) {
          ctx.draw();
        }
      }
    };

    return chart;
  }
};

// 预处理函数
let preprocessors = [];
export function registerPreprocessor(processor) {
  preprocessors.push(processor);
}

export function setCanvasCreator(creator) {
  // 这个函数在实际实现中用于设置canvas创建器
} 